<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        @keyframes dou {
            0% {
                /* background: url(./txgc_6d0e9e5.png) 0  no-repeat; */
            }

            100% {
                /* background: url(./txgc_6d0e9e5.png) -100%  no-repeat; */
                transform: translateX(-100%);
            }
        }

        @keyframes move {
            0% {
                transform: translateX(-200px);
            }

            100% {
                transform: translateX(1600px);
            }
        }

        body {
            overflow: hidden;

            height: 700px;
            position: relative;
        }
/* 
        .f1 {

            width: 154px;
            height: 121px;
            background: url(./txgc_6d0e9e5.png) no-repeat;
            animation: dou steps(2) .5s infinite;
        } */

        .da1 {
            position: absolute;
            bottom: 10px;
            width: 154px;
            height: 121px;
            animation: move 10s infinite linear;
            overflow: hidden;
        }

        img {
            animation: dou steps(2) .5s infinite;
            
        }

        .f2 {
            transform: translateX(-200px);
            overflow: hidden;
            position: absolute;
            bottom: 10px;
            width: 167px;
            height: 176px;
            animation: move 10s infinite linear;
            animation-delay: 2s;
            /* background: url(./txgh_fee2457.png) no-repeat; */
            /* animation: dou steps(2) .5s infinite; */
        }

        .f3 {
            overflow: hidden;
            position: absolute;
            bottom: 10px;
            width: 161px;
            height: 149px;
            animation: move 10s infinite linear;
            animation-delay: 4s;
            transform: translateX(-200px);
            /* background: url(./txgl_c15cfd8.png) no-repeat; */
            /* animation: dou steps(2) .5s infinite; */
        }

        .f4 {
            overflow: hidden;
            position: absolute;
            bottom: 10px;
            width: 171px;
            height: 157px;
            animation: move 10s infinite linear;
            animation-delay: 6s;
            transform: translateX(-200px);
            /* background: url(./txgq_d281c9b.png) no-repeat; */
            /* animation: dou steps(2) .5s infinite; */
        }
    </style>
</head>

<body>
    <div class="da1"><img src="./txgc_6d0e9e5.png" alt=""></div>
    </div>
    <div class="f2"><img src="./txgh_fee2457.png" alt=""></div>
    <div class="f3"><img src="./txgl_c15cfd8.png" alt=""></div>
    <div class="f4"><img src="./txgq_d281c9b.png" alt=""></div>
</body>

</html>